<template>
  <v-app>
  <v-content class="main">
    <aibotton></aibotton>
    <v-container fluid fill-height>
      <v-layout align-center justify-center>
        <v-flex xs12 sm8 md4>
          <v-card class="elevation-12 logBg" light >
            <v-toolbar >
              <v-spacer style="text-align: center;font-size: 32px;">登录</v-spacer>
            </v-toolbar>
            <v-card-text>
              <v-form action='login'>

                <v-text-field required placeholder="邮箱"  style="font-size: 24px" v-model="email" type="text" :rules="[rules.required(email)]"/>
                <v-text-field required placeholder="密码"  style="font-size: 24px" v-model="password" type="password" :rules="[rules.required(password)]"/>
                <a @click="toRegister" style="font-size: 18px">没有账号？请注册</a>
                <br>
                <v-btn @click="login" color="red" style="width: 16%;left: 42%;border-radius: 20px;margin-top: 20px;color: white;font-size: 24px" >登录</v-btn>

              </v-form>
            </v-card-text>
          </v-card>
        </v-flex>
      </v-layout>
    </v-container>
  </v-content>
  </v-app>
</template>
<script>
import {rules} from "@/utils/validatingRules/validating-rules";
import aibotton from "../components/views/common/AI/aibotton";

export default {
  name: 'Login',
  data () {
    return {
      email: "",
      password: "",
      rules
    }
  },
  components:{
    aibotton
  },
  methods: {
    toRegister(){
      this.$router.push('/user/register')
    },
    login() {
      if ( rules.required(this.email) != true||rules.required(this.password)!=true){
        this.$Message.error("请完整填写登陆信息")
        return
      }
      this.$api.common.login(this.email,this.password).then(res =>{
        let result = res
        if (result.success == true){
          console.log(result)
          this.$store.commit("setToken",result.data.token)
          this.$store.commit("setUser",{
            uid : result.data.id,
            username: result.data.username,
            email: this.email,
            avatar:result.data.avatar,
            applyStatus:result.data.applyStatus,
            isManager: result.data.isManager
          })
          this.$store.commit("setisLogin",true)
          this.$Message.success("登陆成功")
          this.$router.push ({path: '/overview/domestic'})
        }
        else {
          this.$Message.error("登陆失败，原因："+ res.exc);
        }
      })
      .catch(function (error){
        console.log(error)
        this.$Message.error("注册失败,出现了意料之外的错误")
      })
    }
  }
}

</script>
<style>

</style>
